<template>
	<view class="cardMain" @click="onProductClick(productId)">
		<view class="cardLeft">
			<image :src="image"></image>
		</view>
		<view class="cardCenter">
			<view class="cenermain">
				<view class="mainText">{{name }}</view>
				 <slot></slot>
				<view class="footMain">
					<text style="color:red">¥ {{token && UserState == '20'?price:'**' }}</text>
					<text style="color:#909399;padding-left: 20rpx;">已售 {{ sellCount }}</text>
				</view>
			</view>
		</view>
		<view v-if="productType != 2" class="cardRight" @click.stop="handlerClick(productId)">
			<image src="../../static/tabbar/cart_1.png"></image>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			productId: {
				type: Number,
				default: 0
			},
			productType:{
				type: String,
				default: ''
			},
			name: {
				type: String,
				default: ''
			},
			image: {
				type: String,
				default: ''
			},
			price: {
				type: [String, Number],
				default: 0
			},
			sellCount: {
				type: [String, Number],
				default: 0
			}

		},
		data() {
			return {
				token:uni.getStorageSync('token'),
				UserState:uni.getStorageSync('UserState'),
			}
		},
		onShow() {
			this.getUserState();
		},
		methods: {
			// 获取审批状态
			getUserState(){
				let self = this;
				self._post('user/user/detail', {
					source: self.getPlatform()
				}, function(res) {
					// AUDIT("审批中", 10),
					// NORMAL("正常", 20),
					// DISABLE("禁用", 30),
					// REFUSE("审批拒绝",40),
					uni.setStorageSync('UserState', res.data.status);
				});
			},
			handlerClick(e) {
				this.$emit('onToChart',e)
			},
			onProductClick(e) {
				this.$emit('onProductClick',e)
			}
		}

	}
</script>

<style>
	.cardMain {
		display: flex;
		padding: 10rpx;
		border-bottom: 1px solid #efefef;
		width: 90%;
		margin: 5rpx auto;
		background: #fff;
		border-radius: 10rpx;
		box-sizing: border-box;
		overflow: hidden;
	}

	.cardMain .cardLeft {
		width: 200rpx;
		height: 200rpx;
		padding: 20rpx;
		border-radius: 5rpx;
	}

	.cardMain .cardLeft image {
		width: 200rpx;
		height: 200rpx;
		border-radius: 10rpx;
	}

	.cardMain .cardCenter {
		flex: 1;
		overflow: hidden;
	}

	.mainText {
		padding: 10rpx;
	}

	.cenermain {
		position: relative;
		height: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		/* width: 66%; */
	}

	.footMain {
		position: absolute;
		bottom: 0px;
	}

	.cardMain .cardRight {
		width: 50rpx;
		position: relative;

	}

	.cardMain .cardRight image {
		width: 50rpx;
		height: 50rpx;
		bottom: 0px;
		position: absolute;
	}
</style>